import 'package:flutter/material.dart';

class ChipPage extends StatefulWidget {
  final Map<String, dynamic> arguments;
  ChipPage({Key key, this.arguments}) : super(key: key);

  @override
  _ChipPageState createState() => _ChipPageState();
}

class _ChipPageState extends State<ChipPage> {
  List<TagModel> _tags;

  @override
  void initState() {
    super.initState();
    this._restoreTags();
  }

  List<TagModel> _oriTags() {
    return <TagModel>[
      TagModel(name: 'book'),
      TagModel(name: 'iPhone'),
      TagModel(name: 'egg'),
      TagModel(name: 'pen'),
      TagModel(name: 'beautifully'),
      TagModel(name: 'and'),
      TagModel(name: 'common'),
      TagModel(name: 'digital'),
      TagModel(name: 'iOS'),
      TagModel(name: 'web'),
      TagModel(name: 'projects'),
      TagModel(name: 'format'),
    ];
  }

  _restoreTags() {
    this._tags = this._oriTags();
  }

  @override
  Widget build(BuildContext context) {
    return Container(
      child: Scaffold(
        appBar: AppBar(
          title: Text('ChipPage'),
        ),
        body: ListView(
          children: <Widget>[
            ListTile(
              contentPadding: EdgeInsets.all(0.0),
              title: Text('Chip Demo'),
              subtitle: Container(
                color: Colors.red,
                padding: EdgeInsets.all(8.0),
                child: Wrap(
                  spacing: 8.0,
                  children: <Widget>[
                    Chip(
                      label: Text('Apple'),
                      backgroundColor: Colors.blue,
                      avatar: Icon(Icons.people),
                      padding: EdgeInsets.symmetric(horizontal: 6.0),
                    ),
                    Chip(
                      label: Text('orange'),
                      backgroundColor: Colors.blue,
                      avatar: CircleAvatar(
                        backgroundImage: NetworkImage('http://b.hiphotos.baidu.com/zhidao/pic/item/cc11728b4710b912b1508c8bc3fdfc0392452235.jpg'),
                        child: Text('橘'),
                      ),
                      padding: EdgeInsets.symmetric(horizontal: 6.0),
                    ),
                    Chip(
                      label: Text('Banana'),
                      backgroundColor: Colors.blue,
                      padding: EdgeInsets.symmetric(horizontal: 6.0),
                      onDeleted: () {
                        print('Chip onDeleted click');
                      },
                      deleteIcon: Icon(Icons.delete),
                      deleteIconColor: Colors.black,
                      deleteButtonTooltipMessage: 'Will remove!', // 长按删除时显示
                    ),
                  ],
                ),
              ),
            ),
            Divider(height: 1.0),
            ListTile(
              contentPadding: EdgeInsets.all(0.0),
              title: Text('ActionChip Demo <有点击效果>'),
              subtitle: Container(
                color: Colors.blueAccent,
                padding: EdgeInsets.all(8.0),
                child: Wrap(
                  spacing: 8.0,
                  children: <Widget>[
                    ActionChip(
                      label: Text('don’t'),
                      backgroundColor: Colors.grey,
                      padding: EdgeInsets.symmetric(horizontal: 6.0),
                      onPressed: () {},
                    ),
                    ActionChip(
                      label: Text('desktop'),
                      backgroundColor: Colors.cyanAccent,
                      padding: EdgeInsets.symmetric(horizontal: 6.0),
                      onPressed: () {},
                    ),
                  ],
                ),
              ),
            ),
            Divider(height: 1.0),
            ListTile(
              contentPadding: EdgeInsets.all(0.0),
              title: Text('FilterChip Demo'),
              subtitle: Container(
                color: Colors.blueAccent,
                padding: EdgeInsets.all(8.0),
                child: Wrap(
                  spacing: 8.0,
                  children: <Widget>[
                    FilterChip(
                      label: Text('selected'),
                      backgroundColor: Colors.grey,
                      padding: EdgeInsets.symmetric(horizontal: 6.0),
                      selected: true,
                      onSelected: (bool value) {
                        print('FilterChip onSelected');
                      },
                      selectedColor: Colors.red,
                    ),
                    FilterChip(
                      label: Text('desktop'),
                      backgroundColor: Colors.cyanAccent,
                      padding: EdgeInsets.symmetric(horizontal: 6.0),
                      selected: false,
                      onSelected: (bool value) {
                        print('FilterChip onSelected');
                      },
                    ),
                  ],
                ),
              ),
            ),
            Divider(height: 1.0),
            ListTile(
              contentPadding: EdgeInsets.all(0.0),
              title: Text('ChoiceChip Demo'),
              subtitle: Container(
                color: Colors.blueAccent,
                padding: EdgeInsets.all(8.0),
                child: Wrap(
                  spacing: 8.0,
                  children: <Widget>[
                    ChoiceChip(
                      label: Text('selected'),
                      backgroundColor: Colors.grey,
                      padding: EdgeInsets.symmetric(horizontal: 6.0),
                      selected: true,
                      onSelected: (bool value) {
                        print('ChoiceChip onSelected');
                      },
                      selectedColor: Colors.red,
                    ),
                    ChoiceChip(
                      label: Text('desktop'),
                      backgroundColor: Colors.cyanAccent,
                      padding: EdgeInsets.symmetric(horizontal: 6.0),
                      selected: false,
                      onSelected: (bool value) {
                        print('ChoiceChip onSelected');
                      },
                    ),
                  ],
                ),
              ),
            ),
            Divider(height: 1.0),
            ListTile(
              contentPadding: EdgeInsets.all(0.0),
              title: Text('Chip dynamic in list'),
              subtitle: Column(
                children: <Widget>[
                  Container(
                    width: double.infinity,
                    color: Colors.yellow,
                    padding: EdgeInsets.symmetric(horizontal: 8.0),
                    child: Wrap(
                      spacing: 8.0,
                      children: this._tags.map(
                        (tag) {
                          return Chip(
                            label: Text(tag.name),
                            padding: EdgeInsets.symmetric(horizontal: 4.0),
                            onDeleted: !tag.isDel
                                ? null
                                : () {
                                    setState(() {
                                      this._tags.remove(tag);
                                    });
                                  },
                          );
                        },
                      ).toList(),
                    ),
                  ),
                  Row(
                    mainAxisAlignment: MainAxisAlignment.end,
                    children: <Widget>[
                      Column(
                        children: <Widget>[
                          IconButton(
                            icon: Icon(Icons.delete_sweep),
                            onPressed: () {
                              if (this._tags.isEmpty) {
                                return;
                              }
                              bool isDel = this._tags.first.isDel;
                              setState(() {
                                this._tags.forEach((tag) {
                                  tag.isDel = !isDel;
                                });
                              });
                            },
                          ),
                          Text('Edit'),
                        ],
                      ),
                      SizedBox(width: 10.0),
                      Column(
                        children: <Widget>[
                          IconButton(
                            icon: Icon(Icons.restore),
                            onPressed: () {
                              setState(() {
                                this._restoreTags();
                              });
                            },
                          ),
                          Text('Restore')
                        ],
                      ),
                      SizedBox(width: 20.0),
                    ],
                  )
                ],
              ),
            ),
            Divider(height: 1.0),
          ],
        ),
      ),
    );
  }
}

class TagModel {
  final String name;
  bool isDel = false;
  TagModel({this.name});
}
